<template>
    <div class="Details">
        <headerTou title="亚华空腔" :isfanhui=true  url='friendsPrivilege'></headerTou>
        <div class="hederDetails">
            <div><span class="borderbottom">全部</span></div>
            <div><span>已使用</span></div>
            <div><span>未使用</span></div>
        </div>
        <div class="wandan">
            <caryouhui :data=dataone url='BusinessAddress'></caryouhui>   
               <caryouhui :data=dataone></caryouhui>
               <caryouhui :data=dataone></caryouhui>
        </div>
    </div>
</template>
<script>
import headerTou from "./zujian/header.vue";
import car from "./zujian/car.vue";
import caryouhui from "./zujian/caryouhui.vue";
export default {
  data() {
    return {
      dataone: {
        qianshu: 90,
        neirongone: "全年口腔保健消费卡",
        neirongtwo: "2018.05.13-2018.06.30"
      }
    };
  },
  created() {
    this.data = {
      src: "../img/logo@3x.png",
      biaoti: "冰火九重天洗车",
      qianshu: "5000"
    };
  },
  mounted() {},
  methods: {},
  //   watch: {
  //       data:function(newll){
  //           console.log(newll)
  //            console.log(111)
  //       }
  //   },
  components: {
    headerTou,
    car,
    caryouhui
  }
};
</script>
<style lang="scss" scoped>
.Details {
  background: #e5e5e5;
  height: 100%;
  .hederDetails {
      background: #ffffff;
    height: 90px;
    width: 750px;
    display: flex;
    justify-content: flex-start;
    div {
      width: 250px;
      height: 90px;
      text-align: center;
      line-height: 90px;
      span {
        height: 88px;
        text-align: center;
        font-family: PingFangSC-Regular;
        font-size: 28px;
        color: #333333;
        border-bottom: 2px solid transparent;
      }
      .borderbottom {
        border-bottom: 2px solid #e97a36;
        color: #e97a36;
      }
    }
  }
  .wandan {
    width: 750px;
    background: #e5e5e5;
    padding:50px 0;

  }
}
</style>

